<template>
    <div class="main-container" id="main-container">
    <div style="background-color: #fff;height:100%;"  id="ProductMasterData"> 
            <a-tabs   :lazy-load="true" type="card"  @change="tabsChange" justify>
                    <a-tab-pane title="中检查布登记报表" key="1">
                            <div style="height: 100%;">
                                <IntermediateData></IntermediateData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="查布疵点明细" key="2">
                            <div style="height: 100%;">
                                <ChaBuDetailData v-if="pageData.fectToday2"></ChaBuDetailData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="查布疵点汇总" key="3">
                            <div style="height: 100%;">
                                <ChaBuSummaryData v-if="pageData.fectToday3"></ChaBuSummaryData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="试纱验布登记报表" key="4">
                            <div style="height: 100%;">
                                <ShishaData v-if="pageData.fectToday4"></ShishaData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="试纱疵点明细" key="5">
                            <div style="height: 100%;">
                                <ShishaDetailData v-if="pageData.fectToday5"></ShishaDetailData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="试纱疵点汇总" key="6">
                            <div style="height: 100%;">
                                <ShishaSummaryData v-if="pageData.fectToday6"></ShishaSummaryData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="成检验布登记报表" key="7">
                            <div style="height: 100%;">
                                <ChenGJianData v-if="pageData.fectToday7"></ChenGJianData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="验布疵点明细" key="8">
                            <div style="height: 100%;">
                                <ChenGDetailData v-if="pageData.fectToday8"></ChenGDetailData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="验布疵点汇总" key="9">
                            <div style="height: 100%;">
                                <ChenGSummaryData v-if="pageData.fectToday9"></ChenGSummaryData>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="成检批核登记报表" key="10">
                            <div style="height: 100%;">
                                <PiheData v-if="pageData.fectToday10"></PiheData>
                            </div>
                    </a-tab-pane>
            </a-tabs>
        </div>
   
    </div>
</template>

<script lang="ts">
 
 import { defineComponent,reactive, ref } from 'vue'

import emitter from '@/hooks/useEventBus'
   export default defineComponent({
       name:'ReportFormsData',
       setup(){
        
     
       const pageData = reactive({
            tableIndex:"1",
            fectToday2: false,
            fectToday3: false,
            fectToday4: false,
            fectToday5: false,
            fectToday6: false,
            fectToday7: false,
            fectToday8: false,
            fectToday9: false,
            fectToday10: false,
       })

  
       const tabsChange = (e:string|number)=>{
           pageData.tableIndex = e as string
           let name = 'fectToday' + e
           if (e != '1') {
                pageData[name] = true
            }  
       }
        return{
            pageData,
            tabsChange
        }
       }
   })
</script>
<style scoped>
    
.main-container {
    height: 100%;
}

:deep(.ag-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-cell-value) {
    user-select: initial;
    -moz-user-select: text;
    -ms-user-select: text;
    -webkit-user-select: text;
}
</style>